<template>
  <div class="home">
     <!-- <Deliver/> -->
    <div class="Img">
         <img src="../assets/首页_01.png" alt="">
    </div>
    <!-- 客户 -->
<div class="home_img">
  
  <ul>
    <li @click="$router.push('/myclients')">
      <img src="../assets/我的客户.png" alt="">
      <p>我的客户</p>
      <p>MYCLIENTS</p>
    </li>
     <li @click="$router.push('/visitrecord')">
      <img src="../assets/客户关怀.png" alt="">
      <p>客户关怀</p>
      <p>CUSTOMER</p>
    </li>
     <li @click="$router.push('/Xiaoxizhongxi')">
      <img src="../assets/消息中心.png" alt="">
      <p>消息中心</p>
      <p>NEWS</p>
    </li>
     <li>
      <img src="../assets/物流单.png" alt="" @click="$router.push('/kuaitidan')">
      <p>物流单</p>
      <p>LOGISTUCS</p>
    </li>
     <li>
      <img src="../assets/songhuodan.png" alt="" @click="$router.push('/deliver')" width="100%">
      <p>送货单</p>
      <p>LOGISTUCS</p>
    </li>
  </ul>
</div>
<!-- 底部导航 -->
<!-- <div class="foot">
 
   <ul>
     <li>
       <img src="../assets/系统功能.png" alt="">
       <p>系统功能</p>
     </li>
      <li>
       <img src="../assets/暂无消息.png" alt="" width=".42rem">
       <p>系统功能</p>
     </li>
      <li>
       <img src="../assets/个人中心.png" alt="">
       <p>个人中心</p>
     </li>
   </ul>
</div> -->
  </div>
</template>

<script>
// @ is an alias to /src
// import Deliver from "@/components/发货单/PersonalDetails"

export default {
  name: 'Home',
  components: {
  //  Deliver
  }
}
</script>
<style lang="less" scoped>
 .home{
   width: 100%;
   .Img{
     width: 100%;
     img{
       width: 100%;
       display: block;
     }
   }
  
 }
  .home_img{
        background: #f5f5f5;
    position: absolute;
    /* position: fixed; */
    z-index: -20;
    // height: 6rem;
     ul{
         font-size: .16rem;
         display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
    li{
  width: 39%;
    background: #ffffff;
    text-align: center;
    height: 1.5rem;
    padding: -4.9re;
    padding: 0.3rem 0.1rem;
    /* margin-bottom: 0.25rem; */
    margin-top: 0.15rem;
    img{
      width: .71rem;
      height: .82rem;
    }
   
    }
     
     }
    
   }
  /*  .foot{
     font-size: .16rem;
     height: .6rem;
     background: #ffffff;
     position: fixed;
     width: 100%;
     bottom: 0;
     left: 0;
   
     ul{
       display: flex;
       height: 100%;
       li{
         height: 100%;
         padding: .1rem 0;
         flex: 1;
         text-align: center;
         color: #999;
         font-size: .12rem;
         img{
           width: .2rem;
           height: .2rem;
         }
       }
     }
   } */
   .active{
     color: #ffffff;
   }
</style>
